// Fill all available space
.fill-block {
  width: 100%;
  height: 100%;
  display: block;
}

// Go to top left corner with absolute positioning
.top-left {
  position: absolute;
  top: 0;
  left: 0;
}

// Hide scrollbar
@mixin hide-scrollbar {
  scrollbar-width: none;
  -ms-overflow-style: none;
  &::-webkit-scrollbar {
    display: none;
    width: 0 !important;
  }
}
.hide-scrollbar {
  @include hide-scrollbar;
}
.hide-scrollbar-mobile {
  @media (max-width: 768px) {
    @include hide-scrollbar;
  }
}

// Disable user selection
.no-user-select {
  user-select: none;
  -webkit-user-select: none; // iOS Safari is a horrible browser
}

// Hide arrows on number input
input[type='number'] {
  appearance: textfield;

  // https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp
  &::-webkit-outer-spin-button,
  &::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
}

// Show the hover cursor and an underline
.rename-hover {
  cursor: text;
  display: inline-block;

  &:hover {
    text-decoration: underline;
    text-decoration-color: var(--color-placeholder-light);
    text-underline-offset: 5px;
    text-decoration-thickness: 1px;
  }
}
